<template>
	<view>
		<view class="flrc bdbso">
			<stext class="flex1" label="全员检索" placeholder="工号或员工姓名查询" v-model="empSearchKey"></stext>
			<view @tap="searchEmp" class="cu-btn bg-blue pos-r">查询 <ripple></ripple></view>
		</view>
		<view class="flrc bdbso">
			<sentity class="flex1" url="/mes/admin/EmpGroup/choice" label="班组查询" placeholder="选择班组" v-model="empSearchGroupId"></sentity>
			<view @tap="searchEmpByGroup" class="cu-btn bg-blue pos-r">查询 <ripple></ripple></view>
		</view>
		<view class="mart2 flex-r flex-fill">
			<view class="flex1 padl2">
				<view class="list-style-1 pad2">已选</view>
				<view class="mart2">
					<view class="pad2 bdbdo flrc pos-r" @tap="selectEmp(emp)" v-for="(emp,index) in empSelected">
						<view>[{{emp.sn}}]</view>
						<view class="flex1 padl1 padtb2">{{emp.name}}</view>
						<view class="fs12"><view class="fa fa-close"></view></view>
						<ripple></ripple>
					</view>
				</view>
			</view>
			<view class="flex1">
				<view class="list-style-2 pad2">待选</view>
				<view class="mart2">
					<view class="pad2 bdbdo flrc pos-r" 
					:class="{'bg-green':emp.selected===true}"
					@tap="selectEmp(emp)" v-for="(emp,index) in empSelectChoices">
						<view>[{{emp.sn}}]</view>
						<view class="flex1 padl1 padtb2">{{emp.name}}</view>
						<view class="fs12"><view class="fa fa-plus-square"></view></view>
						<ripple></ripple>
					</view>
				</view>
			</view>
		</view>
		
	</view>
</template>

<script>
	import com from '../../../assets/js/com'
	import PublicData from './PublicData'
	export default {
		props:{
			value:{
				default(){
					return []
				}
			},
		},
		data() {
			return {
				pd:PublicData,
				empSearchKey:"",
				empSearchGroupId:0,
				empSelectChoices:[],
				empSelected:[],
			}
		},
		mounted() {
			// let empSelected = this.$com.getLocDataObject("mes.baogong.emps")
			// if (empSelected != false){
			// 	this.empSelected = empSelected
			// 	this.pd.emps = empSelected
			// 	this.valueOut()
			// }
			this.empSelected = this.value
			this.pd.emps = this.value
		},
		methods: {
			searchEmp(){
				this.loading = true
				this.$api.post("/mes/admin/Emp/list",{
					_where:{
						_or:[
							{name__regex:this.empSearchKey},
							{sn__regex:this.empSearchKey},
						]
					}
				},res=>{
					this.empSelectChoices = res.data.lists
					this.loading = false
					this.remarkEmpChoices()
				})
			},
			searchEmpByGroup(){
					this.loading = true
					this.$api.post("/mes/admin/EmpGroup/list",{
						_where:{
							id:this.empSearchGroupId
						},
						_dumps:["emps"],
						limit:0,
					},res=>{
						this.loading = false
						if (res.data.lists.length === 1){
						this.empSelectChoices = res.data.lists[0].emps
						this.remarkEmpChoices()
						}
					})
			},
			selectEmp(emp){
				let find = -1
				for(let index in this.empSelected){
					if (this.empSelected[index].id === emp.id){
						find = index
					}
				}
				if (find > -1){
					this.empSelected.splice(find,1)
				}else{
					this.empSelected.push(emp)
				}
				this.remarkEmpChoices()
				this.valueOut()
				this.pd.emps = this.empSelected
				this.$com.setLocData("mes.baogong.emps",this.empSelected)
			},
			remarkEmpChoices(){
				for (let choice of this.empSelectChoices) {
					choice.selected = false
					for (let emp of this.empSelected) {
						if (emp.id == choice.id){
							choice.selected = true
						}
					}
				}
			},
			valueOut(){
				this.$emit("input",this.empSelected)
			}
		},
		getEmps(){
			let empSelected = com.getLocDataObject(PublicData.empsLocalKey)
			if (empSelected != false){
				return empSelected
			}
			return []
		}
	}
</script>

<style>

</style>
